<template>
  <BasicForm ref="formElRef" :labelCol="{span: 5}" :wrapperCol="{ span: 15}" :showResetButton="false" :showSubmitButton="false" :schemas="schemas" :actionColOptions="{ span: 24 }" @submit="handleSubmit" @reset="handleReset"  style="height: 100%">
    <template #jAreaLinkage="{model, field }">
      <JAreaLinkage  v-model:value="model[field]" :showArea="true" :showAll="false"/>
    </template>
    <template #jAreaLinkage1="{model, field }">
      <JAreaLinkage :disabled="isDisabledAuth(['demo.dbarray'])" v-model:value="model[field]" :showArea="true" :showAll="false"/>
    </template>
    <template #JPopup="{model, field }">
      <JPopup v-model:value="model[field]" :formElRef="formElRef" code="report_user" :fieldConfig="[{source:'username',target:'pop1'}]"/>
    </template>
    <template #dargVerify="{model, field }">
      <BasicDragVerify v-model:value="model[field]"/>
    </template>
  </BasicForm>
</template>

<script lang="ts">
import { computed, defineComponent, unref, ref } from 'vue';
import {
  BasicForm,
  ApiSelect,
  FormActionType,
  JEllipsis
} from '/@/components/Form'
import { useMessage } from '/@/hooks/web/useMessage';
import { optionsListApi } from '/@/api/demo/select';
import { useDebounceFn } from '@vueuse/core';
import { schemas } from './limsComponents.data.ts';
import { usePermission } from '/@/hooks/web/usePermission';
import { BasicDragVerify } from '/@/components/Verify/index';

export default defineComponent({
  components: { BasicForm, ApiSelect ,JEllipsis,BasicDragVerify },
  name:'LimsComponents',
  setup() {
    const { isDisabledAuth } = usePermission();
    const check = ref(null);
    const formElRef = ref<Nullable<FormActionType>>(null);
    const { createMessage } = useMessage();
    const keyword = ref<string>('');
    const submitButtonOptions=ref({
      text:"确定"
    })
    const searchParams = computed<Recordable>(() => {
      return { keyword: unref(keyword) };
    });

    function onSearch(value: string) {
      keyword.value = value;
    }

    return {
      schemas,
      formElRef,
      isDisabledAuth,
      optionsListApi,
      submitButtonOptions,
      onSearch: useDebounceFn(onSearch, 300),
      searchParams,
      handleReset: () => {
        keyword.value = '';
      },
      handleSubmit: (values: any) => {
        console.log("values:",values)
        createMessage.success('click search,values:' + JSON.stringify(values));
      },
      check,
    };
  },
});
</script>
